import 'package:boss/color_constant.dart';
import 'package:boss/textStyle/text_style.dart';
import 'package:boss/ui/page/takeoutManagement/page/businessSetting/page/timeRange/model/hour_minute.dart';
import 'package:hi_common/hi_common.dart';
import 'package:flutter/material.dart';

class TimeWheelScrollView extends StatefulWidget {
  final HourMinute initValue;
  final ValueChanged<HourMinute> onChanged;

  const TimeWheelScrollView({
    Key key,
    this.onChanged,
    this.initValue,
  }) : super(key: key);

  @override
  _TimeWheelScrollViewState createState() => _TimeWheelScrollViewState();
}

class _TimeWheelScrollViewState extends State<TimeWheelScrollView> {
  List<int> get hours {
    List<int> temp = [];

    for (int i = 0; i < 24; i++) {
      temp.add(i);
    }

    return temp;
  }

  List<int> get seconds {
    List<int> temp = [];

    for (int i = 0; i < 60; i++) {
      temp.add(i);
    }

    return temp;
  }

  int hourIndex = 0;
  int minuteIndex = 0;

  FixedExtentScrollController hourScrollController;
  FixedExtentScrollController minuteScrollController;

  @override
  void initState() {
    super.initState();

    if (widget.initValue != null) {
      hourIndex = widget.initValue.hour;
      minuteIndex = widget.initValue.minute;
    }

    hourScrollController = FixedExtentScrollController(initialItem: hourIndex);
    minuteScrollController = FixedExtentScrollController(initialItem: minuteIndex);
  }

  @override
  void dispose() {
    hourScrollController.dispose();
    minuteScrollController.dispose();

    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      height: 300.w,
      child: Stack(
        children: <Widget>[
          Row(
            children: <Widget>[
              Expanded(
                child: ListWheelScrollView(
                  controller: hourScrollController,
                  itemExtent: 60.w,
                  physics: FixedExtentScrollPhysics(
                    parent: BouncingScrollPhysics(),
                  ),
                  children: hours.map((item) {
                    return Container(
                      height: 60.w,
                      alignment: Alignment.center,
                      child: Text(
                        '$item' + ' 时',
                        style: TextStyleConstant().normal_1_28,
                      ),
                    );
                  }).toList(),
                  onSelectedItemChanged: (index) {
                    hourIndex = index;
                    if (widget.onChanged != null) {
                      widget.onChanged(HourMinute(hourIndex, minuteIndex));
                    }
                  },
                ),
              ),
              Expanded(
                child: ListWheelScrollView(
                  controller: minuteScrollController,
                  itemExtent: 60.w,
                  physics: FixedExtentScrollPhysics(
                    parent: BouncingScrollPhysics(),
                  ),
                  children: seconds.map((item) {
                    return Container(
                      height: 60.w,
                      alignment: Alignment.center,
                      child: Text(
                        '$item' + ' 分',
                        style: TextStyleConstant().normal_1_28,
                      ),
                    );
                  }).toList(),
                  onSelectedItemChanged: (index) {
                    minuteIndex = index;
                    if (widget.onChanged != null) {
                      widget.onChanged(HourMinute(hourIndex, minuteIndex));
                    }
                  },
                ),
              ),
            ],
          ),
          Positioned(
            top: 120.w,
            left: 0,
            right: 0,
            child: IgnorePointer(
              child: Container(
                height: 60.w,
                decoration: BoxDecoration(
                    border: Border(
                  top: BorderSide(
                    color: ColorConstant.e6e6,
                    width: 1.px,
                  ),
                  bottom: BorderSide(
                    color: ColorConstant.e6e6,
                    width: 1.px,
                  ),
                )),
              ),
            ),
          ),
        ],
      ),
    );
  }
}
